From 7d5ea502db6e016291ad4c57c852d13747674fdc Mon Sep 17 00:00:00 2001
From: real-zephex <zephex-1@outlook.com>
Date: Mon, 27 May 2024 01:06:32 +0530
Subject: =?UTF-8?q?=F0=9F=8E=A8=20refactor(ui):=20Update=20background=20im?=
 =?UTF-8?q?age=20for=20info=20page=20and=20home=20page,=20and=20fix=20vide?=
 =?UTF-8?q?o=20loading=20issue?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/kdrama/[id]/page.jsx | 75 +++++++++++++++++++++++++-------------------
 1 file changed, 43 insertions(+), 32 deletions(-)

(limited to 'src/app/kdrama/[id]/page.jsx')

diff --git a/src/app/kdrama/[id]/page.jsx b/src/app/kdrama/[id]/page.jsx
index 90acded..ce8b6ba 100644
--- a/src/app/kdrama/[id]/page.jsx
+++ b/src/app/kdrama/[id]/page.jsx
@@ -11,39 +11,50 @@ export default async function DramaInfo({ params }) {
 	PreFetchVideoLinks(data.episodes, data.id);
 
 	return (
-		<section className="pt-12  lg:w-9/12 m-auto">
-			<div className="flex items-center justify-center lg:justify-start md:justify-start">
-				<Image
-					isBlurred
-					width={190}
-					src={data.image.toString()}
-					alt="Anime Title Poster"
-					className="m-2"
-				/>
-				<div className="mx-5">
-					<h4 className={`text-2xl`}>
-						<strong>{data.title}</strong>
-					</h4>
-					<div className="mt-1">
-						{data.genres &&
-							data.genres.map((item, index) => (
-								<Chip
-									key={index}
-									color="warning"
-									variant="faded"
-									className="mr-1 mb-1"
-								>
-									<p className="text-xs">{item}</p>
-								</Chip>
-							))}
+		<section
+			style={{
+				backgroundColor: "black",
+				backgroundImage: `radial-gradient(gray 1px, transparent 1px)`,
+				backgroundSize: "40px 40px",
+			}}
+			className="h-screen "
+		>
+			<section className="absolute inset-0 bg-gradient-to-b from-transparent to-black">
+				<section className="pt-12  lg:w-9/12 m-auto">
+					<div className="flex items-center justify-center lg:justify-start md:justify-start">
+						<Image
+							isBlurred
+							width={190}
+							src={data.image.toString()}
+							alt="Anime Title Poster"
+							className="m-2"
+						/>
+						<div className="mx-5">
+							<h4 className={`text-2xl`}>
+								<strong>{data.title}</strong>
+							</h4>
+							<div className="mt-1">
+								{data.genres &&
+									data.genres.map((item, index) => (
+										<Chip
+											key={index}
+											color="warning"
+											variant="faded"
+											className="mr-1 mb-1"
+										>
+											<p className="text-xs">{item}</p>
+										</Chip>
+									))}
+							</div>
+						</div>
 					</div>
-				</div>
-			</div>
-			<DescriptionTabs data={data} />
-			<EpisodesContainer data={data} />
-			<br />
-			<br />
-			<br />
+					<DescriptionTabs data={data} />
+					<EpisodesContainer data={data} />
+					<br />
+					<br />
+					<br />
+				</section>
+			</section>
 		</section>
 	);
 }
-- 
cgit v1.2.3